﻿
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>注册</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="../../../static/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="../../../static/css/login.css" media="all">
  <link rel="stylesheet" href="../../../static/css/admin.css"  media="all">
  <link rel="stylesheet" href="//res.layui.com/layui/dist/css/layui.css"  media="all">
  <!--<style>.wai{margin-left:750px;margin-top: 50px}</style>-->
  <!--<style>.wai{margin-top: 100px}</style>-->
  <style>.wai{margin:0 auto}</style>
</head>
<body>
<div align="center" style="font-size:30px;margin-top: 50px;color:#33AF54">柯军码注册系统</div>
<!--<div class="layui-upload" align="center" style="margin-top: 50px">-->
  <!--<button type="button" class="layui-btn" id="test1">上传图片</button>-->
  <!--<div class="layui-upload-list">-->
    <!--<img class="layui-upload-img" id="demo1">-->
    <!--<p id="demoText"></p>-->
  <!--</div>-->
  <!--<div style="width: 95px;">-->
    <!--<div class="layui-progress layui-progress-big" lay-showpercent="yes" lay-filter="demo">-->
      <!--<div class="layui-progress-bar" lay-percent=""></div>-->
    <!--</div>-->
  <!--</div>-->
<!--</div >-->


<div class="wai">
<form class="layui-form">
  <div class="layui-form-item">
    <label class="layui-form-label">账号</label>
    <div class="layui-input-block" style="width: 200px;">
      <input type="text" name="userName" id="userName" required  lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input" >
    </div>
  </div>

  <div class="layui-form-item">
    <label class="layui-form-label">密码</label>
    <div class="layui-input-inline" style="width: 200px;">
      <input type="password" name="userPassword" id="userPassword" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
    </div>
  </div>
  <!--<div class="layui-form-item">-->
    <!--<label class="layui-form-label">再次输入密码</label>-->
    <!--<div class="layui-input-inline">-->
      <!--<input type="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">-->
    <!--</div>-->
  <!--</div>-->
  <div class="layui-form-item">
    <label class="layui-form-label">注册类型</label>
    <div class="layui-input-block" style="width: 300px;">
      <span style="color:#E47E6E;">退伍军人：</span><input type="radio" name="types" id="type1" value="1" title="" checked>
      <span style="color:#E47E6E;">商家：</span><input type="radio" name="types" id="type0" value="0" title="" ><br/>
      <span style="color:#E47E6E;">志愿者：</span><input type="radio" name="types" id="type2" value="2" title="" >
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">姓名</label>
    <div class="layui-input-block" style="width: 200px;" >
      <input type="text" name="account" id="account" required  lay-verify="required" placeholder="请输入姓名" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">性别</label>
    <div class="layui-input-block" style="width: 200px;">
      男：<input type="radio" name="sex" id="sex1" value="1" title="" checked>
      女：<input type="radio" name="sex" id="sex0" value="0" title="" >
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">身份证号码</label>
    <div class="layui-input-block" style="width: 200px;">
      <input type="text" name="idcard" id="idcard" required  lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
    </div>
  </div>

  <div class="layui-form-item">
    <label class="layui-form-label">手机号</label>
    <div class="layui-input-block" style="width: 200px;">
      <input type="text" name="phonenumber" id="phonenumber" required  lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
    </div>
  </div>


  <fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
    <legend>上传附件</legend>
  </fieldset>
  <div class="layui-upload">
    <button type="button" class="layui-btn layui-btn-normal" id="testList">选择多文件</button>
    <div class="layui-upload-list" style="max-width: 1000px;">
      <table class="layui-table" id="del_table" lay-filter="del_table">
        <colgroup>
          <col>
          <col width="150">
          <col width="260">
          <col width="150">
        </colgroup>
        <thead>
        <tr>
          <th>文件名</th>
          <th>大小</th>
          <th>上传进度</th>
          <th>操作</th>
        </tr>
        </thead>
        <tbody id="demoList">
        </tbody>
      </table>
    </div>
    <button type="button" class="layui-btn" id="testListAction">开始上传</button>
  </div>
  <fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;"></fieldset>

  <div class="layui-form-item">
    <div class="layui-inline">
      <div class="layui-input-inline">
        <input type="hidden" name="hiddenFilePath" id="hiddenFilePath" value="">
      </div>
    </div>
  </div>


  <div class="layui-form-item">
    <div class="layui-input-block" style="width: 200px;">
      <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
  </div>
</form>
</div>
<script src="../../../static/layui/layui.js" charset="utf-8"></script>
<script>
    //Demo
    layui.use(['form','layer','jquery'], function(){
    var form = layui.form,layer=layui.layer,$=layui.jquery;
    //监听提交
    form.on('submit(formDemo)', function(data){
        // 提交保存信息
        $.post({
            // url: 'http://localhost/system/registeruser',
            url: '/system/registeruser',
            dataType: 'json',
            data: JSON.stringify(data.field),
            async: false,
            contentType: 'application/json',   //jax 中 contentType 设置为 false 是为了避免 JQuery 对其操作，从而失去分界符，而使服务器不能正常解析文件
            success:function(res){
                // alert(JSON.stringify(res));
                // console.log(JSON.stringify(res));
                var code = res.code;
                if (code === 200 ){
                    //成功后跳转首页
                    window.location.href= "login.html";
                    alert('注册成功,欢迎登入使用');
                }else if(code ===250){
                    alert('账号已存在！注册失败');
                }
                 else {
                    alert('注册失败，请重新注册')
                }
            }
        });
        return false;
      });
    });

</script>

<script src="//res.layui.com/layui/dist/layui.js" charset="utf-8"></script>


<script type="text/javascript">
    layui.use(['upload', 'element', 'layer', 'table'], function() {
        var $ = layui.jquery
            , upload = layui.upload
            , element = layui.element
            , layer = layui.layer
            , table = layui.table;
        var uploadListIns = upload.render({
            elem: '#testList'
            ,elemList: $('#demoList') //列表元素对象
            ,url: '/system/regpicture' //此处用的是第三方的 http 请求演示，实际使用时改成您自己的上传接口即可。
            ,accept: 'file'
            ,multiple: true
            ,number: 3
            ,auto: false
            ,bindAction: '#testListAction'
            ,choose: function(obj){
                debugger
                var that = this;
                var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
                //读取本地文件
                obj.preview(function(index, file, result){
                    var tr = $(['<tr id="upload-'+ index +'">'
                        ,'<td><img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img"></td>'
                        ,'<td>'+ (file.size/1014).toFixed(1) +'kb</td>'
                        ,'<td><div class="layui-progress" lay-filter="progress-demo-'+ index +'"><div class="layui-progress-bar" lay-percent=""></div></div></td>'
                        ,'<td>'
                        ,'<button class="layui-btn layui-btn-xs demo-reload layui-hide">重传</button>'
                        ,'<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>'
                        ,'</td>'
                        ,'</tr>'].join(''));

                    //单个重传
                    tr.find('.demo-reload').on('click', function(){
                        obj.upload(index, file);
                    });

                    //删除
                    tr.find('.demo-delete').on('click', function(){
                        delete files[index]; //删除对应的文件
                        tr.remove();
                        uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
                    });

                    that.elemList.append(tr);
                    element.render('progress'); //渲染新加的进度条组件
                });
            }
            ,done: function(res, index, upload) {
                //成功的回调
                var filePath = $("#hiddenFilePath").val();
                if (filePath == '') {
                    $("#hiddenFilePath").val(res.data);
                } else {
                    $("#hiddenFilePath").val(filePath + "," + res.data);
                }
                alert(filePath);
                var that = this;
                //if(res.code == 0){ //上传成功
                var tr = that.elemList.find('tr#upload-' + index)
                    , tds = tr.children();
                // tds.eq(3).html(''); //清空操作
                delete this.files[index]; //删除文件队列已经上传成功的文件
                return;
                //}
                this.error(index, upload);
            }
            ,allDone: function(obj){ //多文件上传完毕后的状态回调
                console.log(obj)
            }
            ,error: function(index, upload){ //错误回调
                var that = this;
                var tr = that.elemList.find('tr#upload-'+ index)
                    ,tds = tr.children();
                tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
            }
            ,progress: function(n, elem, e, index){ //注意：index 参数为 layui 2.6.6 新增
                element.progress('progress-demo-'+ index, n + '%'); //执行进度条。n 即为返回的进度百分比
            }
        });

        //监听表格复选框选择
        /* table.on('tool', function(obj){
             console.log(obj)
         });*/
        //监听工具条
        table.on('tool(del_table)', function(obj){
            var data = obj.data;
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr;
            alert(JSON.stringify(data));
            if(layEvent === 'del'){
                layer.confirm('真的删除行么', function(index){
                    obj.del();
                    layer.close(index);
                });
            } else if(obj.event === 'edit'){
                layer.alert('编辑行：<br>'+ JSON.stringify(data))
            }
        });

        // window.deletepic=function (obj,id) {
        //     alert(id);
        //     var parentNode = obj.parentNode.parentNode.parentNode;
        //     let parentNode1 = obj.parentNode.parentNode;
        //     parentNode.removeChild(parentNode1);
        //     $.ajax({
        //         type: "POST",
        //         contentType: "application/json",//设置请求参数类型为json字符串
        //         url: "/news/delFile/"+id,
        //         success : function(result) {
        //         },
        //         error : function() {
        //             alert("删除错误!");
        //         }
        //     });
        // }

        //------------------
        window.deletepic=function (obj,id) {
            debugger
            alert("删除id:"+id);
            let parentNode = obj.parentNode.parentNode.parentNode;
            let parentNode1 = obj.parentNode.parentNode;
            parentNode.removeChild(parentNode1);
            $.ajax({
                type: "POST",
                contentType: "application/json",//设置请求参数类型为json字符串
                url: "/news/delFile/"+id,
                success : function(result) {
                    var code = result.code;
                    if (code === 200) {
                        layer.msg('删除成功', {icon: 1});
                        news_table_Info.reload();
                    } else {
                        layer.msg("删除失败" + resp.msg, {icon: 5});
                    }
                },
                error : function() {
                    alert("删除错误!");
                }
            });
        }
        //-----------------
    });

    /*function deletepic(obj,id) {
        alert(id);
        var parentNode = obj.parentNode.parentNode.parentNode;
        let parentNode1 = obj.parentNode.parentNode;
        parentNode.removeChild(parentNode1);
        $.ajax({
            type: "POST",
            contentType: "application/json",//设置请求参数类型为json字符串
            url: "/news/delFile/"+id,
            success : function(result) {
            },
            error : function() {
                alert("删除错误!");
            }
        });
    }*/
</script>


</body>
</html>
